<script setup>

import {ref} from "vue";

const edu = ref("");
const arr=ref([
    {title:"五粮液",price:888},
    {title:"茅台",price:666},
    {title:"泸州老窖",price:333},
    {title:"剑南春",price:222},
])
const pri=ref(888);
</script>

<template>
<h1>单选组件</h1>
  <!-- value保存单个选项被选中时提交的值 label设置当前选项显示的文字
 一旦选择了某个选项,就会把该选项的value值保存到双向绑定的变量edu中 -->
  <el-radio-group v-model="edu">
    <el-radio value="初中" label="学历:初中"></el-radio>
    <el-radio value="高中" label="学历:高中"></el-radio>
    <el-radio value="本科" label="学历:本科"></el-radio>
    <el-radio value="硕士" >学历:硕士</el-radio>
  </el-radio-group>
  <h4>您选择的是:{{edu}}</h4>
  <hr>
  <el-radio-group v-model="pri">
    <el-radio-button v-for="item in arr" :value="item.price" :label="item.title"></el-radio-button>
  </el-radio-group>
  <h4>您选择的酒的价格是:{{pri}}</h4>
</template>


<style scoped>

</style>